/******************************************************************************************
 * Import
 ******************************************************************************************/

// module
import Taro, { Component } from '@tarojs/taro'
import { Swiper } from '@tarojs/components'
import { AtTabs, AtTabsPane } from 'taro-ui'

// project
import { CPage, CContent, CHeader, CFooter, CFloat, CAround, CBetween, CCenter, CRow, CWrap, CLine, CHand, CItemX, CItemY, CText, CLabel, CSvg, CImage, CButton, CColumn } from '../../library/comp';
import { Base64, Gen, Time, Zip, Session, Storage, Toast} from '../../library/func';
import Icon from '../../project/style/icon';
import Http from '../../project/func/http/http'

// 引用组件
import { Addcbtn, Cbtn, Chead, Destop, Editcunit, Ibottom, Ibottomp, Listunitone, Listunittwo, Listunitthree, LogoLine, LogoLinep, Tabheader } from '../../project/comp'

/******************************************************************************************
 * Export Class
 ******************************************************************************************/

export default class UserCollect extends Component {

	constructor(props) {
		super(props);

		/**
		 * state
		 */
		this.state = {
			showTab:0,
			article:[],
			activity:[],
			search:'',
		}
	}
	/*------------------------------------------------------------------------------------
	 * 声明周期
	 *-----------------------------------------------------------------------------------*/
    
    /*------------------------------------------------------------------------------------
	 * 自定义方法
	 *-----------------------------------------------------------------------------------*/
    config = {
        navigationBarTitleText: '搜索列表'
    }

	// onRedirect
	onRedirect(url){
		wx.redirectTo({
			url: url
		})
	}	

	// onNavigate
	onNavigate(url){
		wx.navigateTo({
			url: url
		})
	}

	//onNavigateBack
	onNavigateBack(num=1){
		wx.navigateBack({
			delta: num
		})                    
	}

	onInput(e){
		let search = e.detail.value;
		this.setState({
			search:search,
		})
	}

	onSearch(){
		if(this.state.search == ""){
			Toast.text("搜索不能为空");
			return;
		}

		Http.Loading({
			url:'search/index.php',
			data:{
				search:this.state.search
			},
			success:(res)=>{
				this.setState({
					article:res.article,
					activity:res.activity,
				})
			}
		});
	}

	handleClick (value) {
		this.setState({
			showTab: value
		})
	}
	
	/**
	 * 渲染
	 */
	render() {

		// 渲染
		return (
			<CPage>
				<CContent>

					<CLine class="f1" h="45" x="center">
						<CBetween bg="#F7F7F7" h="45">
							<CHand class="f09" h="35" x="left" y="center" bg="#fff" my="5" mx="10" ra="45">
								<CSvg ml="10" w='20' h='20'  icon={Icon.search}></CSvg>
		                        <Input
	                            style='border-bottom:1px solid #f0f0f0; height:40px; width:100%'
								onInput = {this.onInput.bind(this)}
		                      />

							</CHand>
							<CHand class="f01" y="center" h="45" x="center">
							<CHand onClick={ this.onSearch } size="14">搜索</CHand>
							</CHand>
						</CBetween>
					</CLine>


					<AtTabs
					animated={false}
					current={this.state.showTab}
					tabList={[
						{ title: '动态' },
						{ title: '活动' }
					]}       
					onClick={this.handleClick.bind(this)}>
						<AtTabsPane current={this.state.showTab} index={0} >

							{
								this.state.article.map((item, key) => {
									return(
										<Listunitthree singe={ true } data={ item } onFunction={ this.onNavigate.bind(this, '/screen/article/detail?id='+item.id) }></Listunitthree>
									)
								})
							}

						</AtTabsPane>
						<AtTabsPane current={this.state.showTab} index={1}>

							{
								this.state.activity.map((item, key) => {
									return(
										<Listunitthree singe={ true } data={ item } onFunction={ this.onNavigate.bind(this, '/screen/activity/detail?id='+item.id) }></Listunitthree>
									)
								})
							}

						</AtTabsPane>
					</AtTabs>
				</CContent>
			</CPage>
		);
	}
};